var AssetEntryView = Backbone.View.extend({

	initialize : function() {
		this.render();
	},
	renderFlipButton : function() {
		var t = this;
		this.FBtns= []
		$('.switch', this.$el).each(function() {
			t.FBtns.push(new FlipButton({
				el : this
			}).register(t));
		});
	},

	renderCombo : function() {
		var t = this;
		this.combos = [];

		var callbacks = [this.updateCategory,
				function() {
				}
		]
		
		// for(var i in ViewData.asset.groups){
			// ViewData.asset.combo[0].opts.push(i);
		// }

		$('.combo', this.$el).each(function(i) {
			t.combos.push(new ComboBox({
				el : this,
				model : ViewData.asset.combo[i]
			})
			//.register(t)
			);

		});
		this.combos[0].ui.change(			
			function(){
				if(ViewData.Login.Asset)
					ViewData.asset.combo[1].set('opts', ViewData.Login.Asset[$(this).val()])
			}			
		); 
	},
	setInput : function() {
		var t = this;
		if(this.op == undefined)
		this.op = $('.add-option', this.$el);
		if(this.btn == undefined)this.btn = $('.btn.go', this.$el);
		if(this.box == undefined)this.box = $('.search-box', this.$el); 
		//.children('input');
		if(this.inp == undefined){
			this.inp = $('.input-prepend input', this.$el);
		}
		if(this.inpbox == undefined){
			this.inpbox = $('.input-prepend', this.$el);
		}
		return this.setLine();
	},
	setLine: function(){
		if(this.line == undefined)
			this.line = this.options.line !== false || this.options.line === true || this.op.css('clear') == 'none';

		var op = this.op, inp = this.inp;
		var ow , iw;
		{
			var w1 = op.width();
			op.css({'width':''});
			$('.opt-view-port', op).css({'width':''});
			var w2 = op.width();
			ow = w2;			
		}
		if (this.line) {
			this.inpbox.hide();
			if(inp.parent().hasClass('input-wrapper'))
				inp.unwrap();
			iw=180;
			inp.width(iw+ow);
			inp.attr({
				'iw' : iw,
				'ow' : ow,
				'w' : iw,
			});	
			this.inpbox.show();		
		} 
		else{
			if(!inp.parent().hasClass('input-wrapper'))
				inp.wrap("<div class='input-wrapper'>");			
			inp.css({'width':''});
		}

		op.attr({
			'w' : ow
		});
		$('.opt-view-port', op).css({
			'width' : ow + 'px'
		});
		if(!op.attr('show')){
			op.css({
				'overflow' : 'hidden',
				'width' : '0px'
			});	
		}
		else{
			if(this.line)inp.width(iw);
		}


		if(inp.attr('disabled')){
			if(this.line)
				this.inpbox.hide();
			else this.inpbox.show();
		}
		return this;	
	},
	render : function() {
		var t = this;

		var template = $("#search_template").html();
		this.$el.html(template);
		this.renderFlipButton();
		// this.renderSticky();
		this.renderCombo();
		this.setInput();
		this.setPopupMenu();
		this.box.on({
			"user": this.userUpdate
		});
		Auth.ctrl.push(this.box);	
		this.box.trigger("user");		
		$('.btn.go', this.$el).click(function(e) {
			var ret = false;
			// for search, both value and type are needed.			
			if(ViewData.asset.action == 1){
				ret = ViewData.asset.search.val.length > 0 && ViewData.asset.search.type.length > 0;
				if(ViewData.asset.search.val.length == 0)
				{
					t.inpbox.addClass("control-group error");
				}
				else if(!ViewData.asset.search.type || ViewData.asset.search.type.length == 0)
					t.inpbox.addClass("control-group error");
				if(ret){
					var model = false;
					if(ViewData.asset.tabs.length>0)
						model = ViewData.asset.tabs.find(function(tab){
							return tab.get('item') && tab.get('item').val == ViewData.asset.search.val
							&& tab.get('item').type == ViewData.asset.search.type
						})
					
					if(!model){
						var obj = {item: {val:ViewData.asset.search.val, type: ViewData.asset.search.type}}
						model = ViewData.asset.tabs.add(obj).last();
					}
					
					$.ajax({
						url : util.sfbase+"/rest/asset/get",
						type : "POST",
						dataType : "json",
						data : {
							type: ViewData.asset.search.type,
							value: ViewData.asset.search.val
						},
						error : function(xhr, ajaxOptions, thrownError) {
							//$.unblockUI();
							alert("error:" + thrownError);
							model.view.home.click();
							return false;
						},
						success : function(data) {
							while (data.flag == 0) {
								
								//construct page
								var page_readOnly = true, module = data.module;
								if(module){
									module = module.substring(4);
								}else{
									alert("type error");
									break;
								}
								
								if(module == "BASIC" || module == "COMMODITY" || module == "FUTURE_OPTION" || module == "DERIVATIVE_FUTURE" || module == "CASH_OPTION" || module == "DERIVATIVE_OTHERS"){
									var g = PT.groupArray[module];
									var m = module.replace('_', ' ');
									if(g.flag){
										g.obj.setValue(data);
									}else{
										func.constructPage(page_readOnly, PT.getAssetPage(module), viewFactory.AssetDetailBlock(), data);
									}
									model.set('sub', m )
									model.set('subName', module );
									model.set('data', data)
									ViewData.layout.at('0').set('sub', m);
									model.view.$el.click();
									return;
								}else{
									alert("not supported");
								}

								break;
							}
							if (data.flag == 1) {
								alert(data.error);
							} else {
								alert("results format error");
							}
							// $.unblockUI();
							model.view.home.click();
							return false;
						}
					});					
					
					
				}
				
				
								
			}

				
			return ret;
		});
		
	
	},
	userUpdate: function(event){
		// var t=event.data;
		var sw = $('.switch', this).first();
		var asset = ViewData.Login.Asset;
		if(asset !== undefined){
			if(asset.constructor == Object){
				ViewData.Asset.combo[0].set('opts', _.keys(ViewData.Login.Asset));
				sw[0].disable = false;	
			}
			else{						
				if(sw[0].view.status == 0)
					sw[0].view.toggle();
				sw[0].disable = true;
	
			}
		}
		
		
	},	
	update: function(){
		this.setInput();
				
	},
	setPopupMenu : function() {
		
		this.tipsMenu = new PopupTipsMenu({
			el : $('.input-prepend', this.$el),
			collection : ViewData.asset.tips
		});
		
	},

	toggleControl : function(obj, w) {
		obj.op.width((100 - w) / 100 * obj.op.attr("w"));
		if (obj.line)
			obj.inp.width(parseInt(obj.inp.attr("w")) + w / 100 * obj.inp.attr("ow"));
	},

	setOverflow : function(obj, status) {
		// Start Clicking from flip button.
		//call entry defined at the html elements
		var search_icon = $('i', obj.inpbox);
		if (status == 1) { // to search
			if (obj.inp.attr('disabled')) { // original next button is issue, expand from 0
				if(obj.line){
					obj.inpbox.show();
					obj.inp.attr({
						"w" : 0,
						"ow": parseInt(obj.inp.attr('iw'))+parseInt(obj.op.attr('w'))
					});							
				}
				obj.inp.attr('to-disable', 1);
				obj.inp.removeAttr('disabled');
			}
			else{
				if(obj.line){
					obj.inp.attr({
						"w" : obj.inp.attr('iw'),
						"ow": parseInt(obj.op.attr('w'))
					});	
				}					
			}
		
			obj.op.css({
				'overflow' : 'hidden'
			});
			obj.op.removeAttr('show');
			search_icon.removeClass('icon-plus').addClass('icon-search');

		} else {// to Add
			if (obj.inp.attr('to-disable')){// current is issue, shrink
				obj.inp.attr('disabled', 1);
				if(obj.line){
					obj.inp.attr({
						"w" : 0,
						"ow": parseInt(obj.inp.attr('iw'))+parseInt(obj.op.attr('w'))
					});
				}				
			}
			else{
				if(obj.line){
					obj.inp.attr({
						"w" : obj.inp.attr('iw'),
						"ow": parseInt(obj.op.attr('w'))
					});	
				}					
			}			
			obj.op.attr('show',1);
			obj.tipsMenu.stickyTag.hide();	
			search_icon.removeClass('icon-search').addClass('icon-plus');
		}
		ViewData.asset.action = status;
	},
	rmOverflow : function(obj, status) {
		//Clicked
		if (status == 0) { // to Add
			// obj.op.attr('show',1);
			obj.op.css('overflow', '');
			if(obj.line&&obj.inp.attr('to-disable'))
				obj.inpbox.hide();
		
			// if (obj.inp.attr('disabled') == '0')
				// obj.inp.attr('disabled',1);//obj.inp.parent().css("visibility","hidden");
		}
	},
	toggleInput : function(obj, w) {
		if (obj.line)
			obj.inp.width(w / 100 * obj.inp.attr("w"));
	},
	setShow : function(obj, status) {
		if (status == 1) {
			if(obj.line){
				obj.inpbox.show();
				obj.inp.attr({
					"w" : obj.inp.attr('iw')
				});			
			}	
			obj.inp.removeAttr('disabled');
			obj.inp.removeAttr('to-disable');
		}
		ViewData.asset.addType = status;
	},
	setHide : function(obj, status) {
		if (status == 0) {//
			//obj.inp.parent().css("visibility","hidden");
			obj.inp.attr('disabled',1);
			if(obj.line){
				obj.inpbox.hide();
				obj.inp.attr({
					"w" : 0,
				});
			}
		}
	},


}); 